<template>
  <div style="margin-top:20px">
    <el-card>
      <CategorySelector :is-forbidden="isShowAttrList" />
    </el-card>
    <el-card style="margin-top:10px">
      <AttrList v-if="isShowAttrList" @setIsShowAttrList="isShowAttrList=$event" @setAttr="getAttrValue" />
      <SaveAttr v-else :attr-value="attrValue" @setIsShowAttrList="isShowAttrList=$event" />
    </el-card>
  </div>
</template>

<script>
import AttrList from './components/AttrList.vue'
import SaveAttr from './components/SaveAttr.vue'
export default {
  name: 'Attr',
  components: {
    AttrList,
    SaveAttr
  },
  data() {
    return {
      isShowAttrList: true,
      attrValue: {}
    }
  },
  methods: {
    getAttrValue(obj) {
      this.attrValue = obj
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
